loginDialog: fade out before starting session

Right now we very abruptly kill the login screen
and start the users session without any transition
out.

This commit introduces a fade out of the dialog and
panels.

https://bugzilla.gnome.org/show_bug.cgi?id=694062

diff --git a/js/gdm/loginDialog.js b/js/gdm/loginDialog.js
index 9c30f9ad9983d6b117974ac6d4c039d6cb906ee8..18b9692ae90e9747f928abae184c8872df809359 100644 (file)
--- a/js/gdm/loginDialog.js
+++ b/js/gdm/loginDialog.js
@@ -44,6 +44,7 @@ const PanelMenu = imports.ui.panelMenu;
 const Tweener = imports.ui.tweener;
 const UserMenu = imports.ui.userMenu;
 
+const _FADE_ANIMATION_TIME = 0.25;
 const _SCROLL_ANIMATION_TIME = 0.5;
 const _TIMED_LOGIN_IDLE_THRESHOLD = 5.0;
 const _LOGO_ICON_HEIGHT = 16;
@@ -914,7 +915,26 @@ const LoginDialog = new Lang.Class({
     },
 
     _onSessionOpened: function(client, serviceName) {
-        this._greeter.call_start_session_when_ready_sync(serviceName, true, null);
+        Tweener.addTween(this.dialogLayout,
+                         { opacity: 0,
+                           time: _FADE_ANIMATION_TIME,
+                           transition: 'easeOutQuad',
+                           onUpdate: function() {
+                               let children = Main.layoutManager.uiGroup.get_children();
+
+                               for (let i = 0; i < children.length; i++) {
+                                   if (children[i] != Main.layoutManager.screenShieldGroup)
+                                       children[i].opacity = this.dialogLayout.opacity;
+                               }
+                           },
+                           onUpdateScope: this,
+                           onComplete: function() {
+                               Mainloop.idle_add(Lang.bind(this, function() {
+                                   this._greeter.call_start_session_when_ready_sync(serviceName, true, null);
+                                   return false;
+                               }));
+                           },
+                           onCompleteScope: this });
     },
 
     _waitForItemForUser: function(userName) {

diff --git a/js/ui/screenShield.js b/js/ui/screenShield.js
index 7e693be2c72a58ae90a9a8b376f721a11f6a4f7f..a2f482a941ece91149986f3a0170bc16ff49edce 100644 (file)
--- a/js/ui/screenShield.js
+++ b/js/ui/screenShield.js
@@ -50,9 +50,11 @@ const SUMMARY_ICON_SIZE = 48;
 // - MANUAL_FADE_TIME is used for lowering the shield when asked by the user,
 //   or when cancelling the dialog
 // - CURTAIN_SLIDE_TIME is used when raising the shield before unlocking
+// - INITIAL_FADE_IN_TIME is used for the initial fade in at startup
 const STANDARD_FADE_TIME = 10;
 const MANUAL_FADE_TIME = 0.8;
 const CURTAIN_SLIDE_TIME = 0.3;
+const INITIAL_FADE_IN_TIME = 0.25;
 
 function sample(offx, offy) {
     return 'texel += texture2D (sampler, tex_coord.st + pixel_step * ' +
@@ -511,9 +513,16 @@ const ScreenShield = new Lang.Class({
 
         this._lockDialogGroup = new St.Widget({ x_expand: true,
                                                 y_expand: true,
+                                                opacity: 0,
                                                 pivot_point: new Clutter.Point({ x: 0.5, y: 0.5 }),
                                                 name: 'lockDialogGroup' });
 
+        Tweener.addTween(this._lockDialogGroup,
+                         { opacity: 255,
+                           time: INITIAL_FADE_IN_TIME,
+                           transition: 'easeInQuad',
+                         });
+
         this.actor.add_actor(this._lockDialogGroup);
         this.actor.add_actor(this._lockScreenGroup);